<template>
  <div>
    <table-box
      v-show="!showDetail"
      ref="refTable"
      table-size="mini"
      :data="tableData"
      :table-config="tableConfig"
      show-index
      :other-filters="otherFilter"
      @btnOperate="btnOperate"
    />
    <abnormal-detail v-if="showDetail" :detail-data="{id:abnormalId}" @goBack="goBack" />
  </div>
</template>
<script>
import { getDeductData } from '@/api/storeRebate'
import abnormalDetail from '../../storeConstruction/exceptionManage/Details.vue'
export default {
  name: 'AbnormalDedct',
  components: { abnormalDetail },
  props: {
    id: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      otherFilter: [],
      tableData: [],
      abnormalId: '',
      showDetail: false,
      tableConfig: {
        // interfacePath: `${process.env.VUE_APP_BASE_API}/api/v1/shopException/page`,
        buttonGroupCode: 'default',
        hideFuncBar: true,
        tabIndex: 0,
        // 表格字段动态配置
        setting: [
          {
            prop: 'exceptionCode',
            label: '异常编码',
            minWidth: '220',
            className: 'btn-green',
            isButton: true,
            clickFun: this.handleDetail
          },
          {
            prop: 'belongModel',
            label: '功能模块',
            minWidth: '130',
            propEnum: {
              domainCode: 'marketing',
              appCode: 'slm',
              dictTypeCode: 'BELONG_MODEL'
            }
          },
          {
            prop: 'bizCode',
            label: '业务编码',
            minWidth: '140'
          },
          {
            prop: 'bizName',
            label: '业务名称',
            minWidth: '140'
          },
          {
            prop: 'exceptionType',
            label: '异常类型',
            minWidth: '140'
          },
          {
            prop: 'constCode',
            label: '门店建设项目号',
            minWidth: '140'
          },
          {
            prop: 'shopName',
            label: '所属门店',
            minWidth: '140'
          },
          {
            prop: 'clientName',
            label: '所属客户',
            minWidth: '140'
          },
          {
            prop: 'officeName',
            label: '所属办事处',
            minWidth: '140'
          },
          {
            prop: 'isBpmReview',
            label: '是否BPM审批',
            minWidth: '140',
            propEnum: {
              domainCode: 'marketing',
              appCode: 'slm',
              dictTypeCode: 'BOOLEANS'
            }
          },
          {
            prop: 'bpmInstanceNo',
            label: 'BPM申请单号',
            minWidth: '140'
          },
          {
            prop: 'createBy',
            label: '异常提报人',
            minWidth: '140'
          },
          {
            prop: 'createTime',
            label: '异常提报时间',
            minWidth: '140'
          },
          {
            prop: 'state',
            label: '异常状态',
            minWidth: '140',
            propEnum: {
              domainCode: 'marketing',
              appCode: 'slm',
              dictTypeCode: 'SHOP_EXCEPTION_STATE'
            }
          }],
        btnList: [
          {
            buttonName: '导出',
            outerFlag: true,
            optCode: 'export'
          }]
      }
    }
  },
  watch: {
    id: {
      handler(v) {
        getDeductData(v).then(res => {
          if (res.success === 1) this.tableData = res.data.records
        })
      }
    }
  },
  created() {
    getDeductData(this.id).then(res => {
      if (res.success === 1) this.tableData = res.data.records
    })
  },
  methods: {
    handleDetail(row) {
      // todo
      this.abnormalId = row.id
      this.showDetail = true
    },
    goBack() {
      this.showDetail = false
    },
    btnOperate(flag) {
      switch (flag) {
        case 'export':
          this.handleExport()
          break
        default:
          break
      }
    },
    // 导出
    handleExport() {

    }
  }
}
</script>
